<!-- 预警模型 -->
<script>
import { findListByPage, openModel, closeModel } from '@/api/model'
import QueryTable from '@/mixins/QueryTable'
import indexDialog from './indexDialog'

export default {
  name: 'model',
  extends: QueryTable,
  components: {
    indexDialog
  },
  data() {
    return {
      FormDialogVisible: false,
      inputList: {
        data: [
          {
            type: 'input',
            label: '模型名称',
            prop: 'modelName'
          },
          {
            type: 'select',
            label: '状态',
            prop: 'modelStatus',
            list: []
          }
        ]
      },
      tableApi: findListByPage, // 表格数据API
      tableConfig: {
        btnsWidth: 200,
        columns: [
          {
            label: '模型名称',
            prop: 'modelName',
            showTooltip: true
          },
          {
            label: '模型描述',
            prop: 'modelDescription',
            showTooltip: true
          },
          {
            label: '模型状态',
            prop: 'modelStatus',
            showTooltip: true,
            width: 100,
            render: () => {
              return {
                default: ({ row }) => {
                  return row.modelStatus == 1 ? '已开启' : '已关闭'
                }
              }
            }
          }
        ],
        btns: [
          {
            text: '启用',
            hide: (row) => row.modelStatus == 1,
            methods: (row) => this.targetStatus(row, '启用')
          },
          {
            text: '停用',
            hide: (row) => row.modelStatus == 0,
            methods: (row) => this.targetStatus(row, '停用')
          }
        ]
      },
      customQueryParam: {},
      row: {}
    }
  },

  computed: {},
  created() {
    this.getDict()
  },
  mounted() {},

  methods: {
    getDict() {
      this.inputList.data[1].list = [
        { label: '全部', value: '' },
        { label: '已开启', value: 1 },
        { label: '已关闭', value: 0 }
      ]
    },
    getDefaultModel() {
      return {
        modelName: '',
        modelStatus: ''
      }
    },
    handleView(row) {
      this.$router.push({
        path: '/type/Publish/PublishDetail',
        query: {
          id: row.id,
          flowStatue: row.flowStatue,
          itemCode: row.itemCode,
          areaCode: row.areaCode
        }
      })
    },
    targetStatus(row, type) {
      this.row = row
      switch (type) {
        case '启用':
          this.FormDialogVisible = true
          break
        case '停用':
          this.closeModel()
          break
      }
    },
    // 关闭预警
    closeModel() {
      this.$confirm(
        '关闭后，系统内无法查看到该模型的预警结果，历史信息也不展示，是否确认关闭？',
        '关闭提醒',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'info'
        }
      )
        .then((action) => {
          closeModel({ id: this.row.id }).then((res) => {
            if (res.success) {
              this.$message.success('关闭成功')
              this.handleSearch()
            }
          })
        })
        .catch(() => {})
    },
    // 开启预警
    openModel(data) {
      let params = {
        ...this.row,
        ...data
      }
      openModel(params).then((res) => {
        if (res.success) {
          this.$message.success('开启成功')
          this.FormDialogVisible = false
          this.handleSearch()
        }
      })
    },
    renderExternal() {
      return (
        <indexDialog
          visible={this.FormDialogVisible}
          row={this.row}
          {...{
            on: {
              submit: (data) => {
                this.openModel(data)
              },
              close: () => {
                this.FormDialogVisible = false
              }
            }
          }}
        ></indexDialog>
      )
    }
  }
}
</script>
